//资产卡片
import ampub from 'ampub';
import fa from 'fa';
import { ajax, base, cacheTools, cardCache, formatNumber } from 'nc-lightapp-front';
import { Component } from 'react';
import CreateNCUploade from 'uap/common/components/CreateNCUploade';
import { facard_msg_dataSource } from '../../facard/const';
import { DepEcharts, LeaseChange } from '../components';
import FaCardCopy from '../components/CardCopy';
import constants from '../constants';
import lrzxAfterEvent from './events/lrzxAfterEvent';
import lrzxBeforeEvent from './events/lrzxBeforeEvent';
import lrzxButtonClick from './events/lrzxButtonClick';

import {
    buttonClick,
	lockcards,
	initTemplate,
	afterEvent,
	headBeforeEvent,
	pageInfoClick,
	toggleFinanceArea,
	accbookSwitchHandler,
	setStatus,
	rowSelected,
	usedeptButtonClick,
	subequipButtonClick,
	stepRentStandardButtonClick,
	rentPayPlanButtonClick,
	depaccrualButtonClick,
	enableDailyInterest,
	enableMonthlyInterest,
	tabShowButtonClick,
	usedeptAfterEvent,
	usedeptBeforeEvent,
	usufructAssetAfterEvent,
	usufructAssetBeforeEvent,
	linkToList,
	enableUsufructAssetTab,
	disableUsufructAssetTab,
	emptyUsufructAssetTab,
	getUsufructAssetTab,
	setUsufructAssetTab,
	handleMeta,
	stepRentAfterEvent,
    showOrHideIsdepfornewcard,
    reset
} from './events';
import './index.less';
import BodyTabDataManager from './manager/BodyTabDataManager';


const { createNCUploader, show: ncUploaderShow, close: ncUploaderClose } = CreateNCUploade;
const { fa_utils: { Relogin: { closeWindowWhenRelogin } } } = fa;
const { components, commonConst: { CommonKeys: { linkQueryConst } }, utils } = ampub;
const { LoginContext: { getContext, loginContextKeys } } = components;
const {
	getThemeUtils,
	cardUtils: { createCardTitleArea, createCardPaginationArea, creatCardSocket },
	msgUtils: { showMessage },
	multiLangUtils: { getMultiLangByID }
} = utils;
const { NCAnchor, NCScrollElement, NCScrollLink, NCAffix, NCBackBtn, NCHotKeys, NCDiv } = base;

const {
	BILL_SOURCE_TYPES,
	MODAL_ID,
	URL,
	UISTATE,
	VOSTATUS,
	CARD_BTNS: { HEAD, TABLE_HEAD },
	CARD_ALL_TABS,
	FIELDS,
	assetDataSource,
	BTN_AREA,
	AREA: {
		CARD: {
			BASIC_INFO_AREA: basicInfoForm,
			FINANCE_AREA: financeForm,
			ALTER_TAB: alter_tab,
			EVALUATE_TAB: evaluate_tab,
			REDUCE_TAB: reduce_tab,
			DEVALUE_TAB: devalue_tab,
			DEPLOY_TAB: deploy_tab,
			DEP_TAB: dep_tab,
			USEDEPT_TAB: usedept_tab,
			LRZX_TAB: lrzx_tab,
			SUBEQUIP_TAB: subequip_tab,
			USUFRUCTASSET_AREA: usufructassetForm,
			RENTPAYPLAN_TAB: rentpayplan_tab,
			DEPACCRUAL_TAB_MONTH: depaccrual_tab_month,
			STEPRENTSTANDARD_TAB: steprentstandard_tab,
			LOGDEPACCRUAL_TAB: logdepaccrual_tab,
			LOGCHANGERECORD_TAB: logchangerecord_tab,
			LEASE_CHANGE_TAB: lease_change_tab
		}
	}
} = constants;

class Card extends Component {
	constructor(props) {
		super(props);
		props.use.form(basicInfoForm, financeForm, usufructassetForm, 'copyCard');
		props.use.cardTable(
			alter_tab,
			evaluate_tab,
			reduce_tab,
			devalue_tab,
			deploy_tab,
			dep_tab,
			usedept_tab,
			lrzx_tab,
			subequip_tab,
			rentpayplan_tab,
			depaccrual_tab_month,
			steprentstandard_tab,
			logdepaccrual_tab,
			logchangerecord_tab
		);

		props.use.editTable(lease_change_tab);

		this.curr_pk_card = null; //当前pk_card, 用于翻页
		this.curr_transiType = null; //当前transiType, 用于翻页
		this.basicInfoData = {}; // 卡片基本信息（除账簿数据）
		this.assetDataMap = {}; // <pk_accbook, assetVo> 的数据映射
		this.assetDataMapBack = {}; //assetDataMap 的备份
		this.cardVoAttributes = []; //CardVO 的属性列表
		this.business_accbook = ''; //业务账簿
		this.editAbleBook = []; //可编辑的账簿
		this.depmethodFormulaFieldMap = {}; //折旧方法公式字段
		this.depmethods = []; //折旧方法列表
		this.fa10param = {}; //FA10 参数<pk_accbook, boolean>
		this.accbookCurrency = {}; //账簿币种 参数<pk_accbook, pk_currency_book>
		this.fa83param = false; //--支持多成本中心、多利润中心分摊	否（默认值）(集团级数据)
		this.is_allow_dept_midlev = false; //是否允许部门非末级(组织级数据)
		this.basicInfoFields = []; //基本信息区域字段
		this.financeFields = []; //财务区域字段
		this.facardCopy = new FaCardCopy('card');
		this.bodyTabDataManager = new BodyTabDataManager(this); //表体页签数据管理
		this.templateid = '';
		this.editCategoryWhenUpdate = false; //在修改卡片时是否修改了资产类别
		this.reviseFields = []; //允许修订的字段
		this.leaseChangeDiffData = {}; //变更记录（租赁变更需要存储变更记录）
		this.leaseChangeNewData = {}; //租赁变更页签数据封装（变更后数据）
		this.leaseChangeOldData = {}; //租赁变更页签数据封装（变更前数据）
		this.isNeedCalculateLeaseLiabilities = false; //是否需要计算租赁负债
		this.bill_source_4A3A = false; //合同租入时的不可编辑控制标志。替换旧标志featurepack_flag（固定资产特性包标识）
		this.relativeData = {}; // 用户自定义数据，编辑后返回
		this.originvalue_digit = 2; // 原币原值精度
		this.usufructasset_tab_fields = new Set(); // 记录使用权页签字段
		this.state = {
			syncCallback: '', //哑状态，专门用来异步回调任务
			bill_source: '', //资产来源 4A3A-资产租入生成
			asset_name: '', //资产名称this.
			asset_code: '', //资产编码
			assetuser: '', //使用人
			usedept: '', //使用部门
			usedeptIsNotNull: true, //模板中的使用部门是否不能为空的标志
			mandeptIsNotNull: true, //模板中的管理部门是否不能为空的标志
			pageCode: '', //页面pageid, 也是交易类型的code
			financeShowFlag: false, //财务区展开标志
			usufructasset_flag: false, //使用权标识
			accbooks: [], //账簿数组 [{pk_accbook, accbookName}]
			currentPkaccbook: '', //当前选中的账簿
			isaccruedbymonth: true, //按月计提标识
			transiTypeAry: [], //卡片交易类型
			//usedeptScales: [], //多使用部门的数据
			dep_tab_style: 'table', //折旧记录
			depEchartsData: {}, //折旧记录echarts数据
			depEchartsHide: true, //折旧记录echarts显示控制
			uploader: {} //附件上传
		};

		this.getAccbookDataByPkaccbook.bind(this);
		this.wrapAccbookData.bind(this);
		this.wrapBasicInfoData.bind(this);
		this.syncFinanceForm.bind(this);
		this.getDataBack.bind(this);
		this.getAssitParam.bind(this);
		this.syncDataForCommit.bind(this);
		this.parseAssetData.bind(this);
		this.setAssetSimpInfo.bind(this);
		this.getDepTableHead.bind(this);
		this.doInit.bind(this);
		this.backToList.bind(this);
		this.setValue.bind(this);
		this.updateAssetCache.bind(this);
		this.getPkcardFromUrl.bind(this);
		this.getPkcardFromClientKey.bind(this);
		this.getPkaccbookByPkcardHis.bind(this);
		this.resetOnAdd.bind(this);
		this.financeOrgInit.bind(this);
		this.clearBodies.bind(this);
		this.setFAParam.bind(this);
		this.updateAssetCacheOnSocketMsg.bind(this);
		this.setDepaccrualTab.bind(this);
		this.updateBillSource4A3A.bind(this);
		this.updateScale.bind(this);
		this.isAllowChangeHeadWhenEdit.bind(this);
	}

	componentDidMount() {
		const that = this;
		/* 处理刷新 */
		let status = that.props.getUrlParam('status') || UISTATE.BLANK;
		if (UISTATE.BLANK == status) {
			that.props.setUrlParam({ status });
		}

		closeWindowWhenRelogin(this, {
			formid: basicInfoForm,
			statusControl: UISTATE.EDIT
		});

		this.doInit()
			.then((data) => {
				return initTemplate.call(that, that.props);
			})
			.then( async () => {
				//判断是否来源于消息打开
				let facard_msg = getContext('facard_msg', facard_msg_dataSource);
				if (facard_msg) {
					let { BillCard, FAParam } = facard_msg;
					this.setValue(BillCard);
					this.setFAParam(FAParam);
				} else {
					//请求数据
					if (status !== UISTATE.ADD) {
						//如果来源于联查: id 的值是 pk_card; 否则是 pk_cardhistory
						let pk = that.props.getUrlParam('id');
						let scene = that.props.getUrlParam(linkQueryConst.SCENE);
						let sceneParam = {};

						if (scene === linkQueryConst.SCENETYPE.linksce) {
							//来源于联查，联查分两个场景：
							//1、联查卡片最小未结账月的数据
							//2、联查卡片历史期间的数据（通过判断 pk_cardhistory）

							// 联查到卡片有两种方式
							// 方式一：通过公共方法 ampub 中 openAssetCardByPk 联查卡片
							let linkParam = cacheTools.get('fa_facard_linkQuery_param');
							if (linkParam) {
								sceneParam = {
									pk_cardhistory: linkParam['pk_cardhistory'],
									pk_accbook: linkParam['pk_accbook'],
									accyear: linkParam['accyear'],
									period: linkParam['period']
								};
								//删除缓存
								cacheTools.remove('fa_facard_linkQuery_param');
							}

							// 方式二：通过 页面编码或交易类型 + pk_card, 多用于外领域联查卡片（比如事务错误中心联查到卡片）
							// 这里已支持
						} else {
							//取出真正的 卡片主键
							let pk2ClientKeyMap = cardCache.getDefData(constants.pk2ClientKeyMap, assetDataSource);
							let clientKey = pk2ClientKeyMap ? pk2ClientKeyMap[pk] : '';
							pk = this.getPkcardFromClientKey(clientKey);
							this.state.currentPkaccbook = this.getPkaccbookByPkcardHis();
						}
						if (pk) {
							return that.getData(pk, sceneParam);
						}
					} else {
						this.financeOrgInit();
					}
					setStatus.call(that, that.props);
				}
			})
			.then(
				/* 查询数据成功回调  */
				(data) => {
					if (data) {
						that.getDataBack(data);
						if (status === UISTATE.EDIT) {
							buttonClick.call(that, that.props, HEAD.EDIT);
						}
					}
				},
				(obj) => {
					//查询卡片错误之后，将卡片从缓存和列表中删除
					let scene = that.props.getUrlParam(linkQueryConst.SCENE);
					if (scene !== linkQueryConst.SCENETYPE.linksce) {
						obj['pk_cardhistorys'] = [ that.props.getUrlParam('id') ];
						that.updateAssetCache(obj, 'del');
					}
					setStatus.call(that, that.props, UISTATE.BLANK);
				}
			);
	}

	//初始化
	doInit() {
		const that = this;
		const promise = new Promise((resolve, reject) => {
			ajax({
				url: URL.INIT,
				data: {},
				success: (res) => {
					let { success, data } = res;
					if (success) {
						that.cardVoAttributes = data.cardVoAttributes;
						that.fa83param = data.FA83;
						that.state.transiTypeAry = data.billTypeAry;
						that.canEditUsufructasset = data.canEditUsufructasset;

						if (data.msgs && data.msgs.length) {
							showMessage(that.props, { content: data.msgs.join(','), color: 'warning' });
						}

						resolve(data);
					} else {
						reject(data);
					}
				},
				error: (err) => {
					showMessage(that.props, { content: err.message, color: 'danger' });
					reject(err);
				}
			});
		});
		return promise;
	}

	componentWillMount() {
		// 监听浏览器关闭
		window.onbeforeunload = () => {
			// 解锁卡片
			let status = this.props.getUrlParam('status');
			if (status === 'edit') {
				if (!!window.ActiveXObject || 'ActiveXObject' in window) {
					//IE11浏览器（同步解锁）
					lockcards.call(this, 'unlock', false);
				} else {
					//其它浏览器（异步解锁）
					lockcards.call(this, 'unlock', true);
				}
			}
			//浏览器回退键
			if (window.history && window.history.pushState) {
				window.onpopstate = () => {
					lockcards.call(this, 'unlock', false);
				};
			}
		};

		//关闭浏览器页签事件
		window.onunload = () => {
			/*ajax({
				url: '/nccloud/fa/fapub/diagnose.do',
				success: (res) => {
				}
			});*/
			// 清除自定义缓存
			this.state.transiTypeAry.map((transiTypeVo) => {
				cardCache.setDefData(transiTypeVo.pk_billtypecode, constants.templateDataSource, '');
			});
		};
	}

	// 移除事件
	componentWillUnmount() {
		window.onbeforeunload = null;
	}

	//设置FA 参数（【修改】卡片、打开消息时）
	setFAParam(paramVO) {
		let { props: { cardTable } } = this;
		this.depmethodFormulaFieldMap = paramVO['depmethodFormulaFieldMap']; //折旧方法公式字段
		this.depmethods = paramVO['depmethods']; //折旧方法列表
		this.fa10param = paramVO['fa10param'] || {}; //FA10 参数<pk_accbook, boolean>
		this.accbookCurrency = paramVO['accbookCurrency'] || {}; //账簿币种
		this.is_allow_dept_midlev = paramVO['is_allow_dept_midlev'];
		this.isHeadAssetFinanceorg = paramVO['isHeadAssetFinanceorg'];
		// 设置附属设备页签的精度，新增的时候没有编辑后事件，所以在这里设置一下
		cardTable.setColScale([
			{
				areacode: subequip_tab,
				fieldcode: 'originvalue',
				scale: paramVO['org_digit']
			}
		]);
	}

	//新增，修改，租赁变更，复制，翻页重置数据
	resetOnAdd() {
		let { props: { form } } = this;
		this.curr_pk_card = null;
		this.assetDataMap = {};
		this.assetDataMapBack = {};
		this.business_accbook = '';
		this.is_allow_dept_midlev = false;
		this.basicInfoData = {};
		this.editCategoryWhenUpdate = false;
		this.leaseChangeDiffData = {};
		this.leaseChangeNewData = {}; //租赁变更页签数据封装（变更后数据）
		this.leaseChangeOldData = {}; //租赁变更页签数据封装（变更前数据）
		this.isNeedCalculateLeaseLiabilities = false;
		this.bill_source_4A3A = false;

		//清空表单及表格
		form.EmptyAllFormValue(basicInfoForm);
		if (this.state.financeShowFlag) {
			form.EmptyAllFormValue(financeForm);
		}
        
		this.setState({
			bill_source: '',
			asset_name: '',
			asset_code: '',
			assetuser: '',
			usedept: '',
			usedeptIsNotNull: true,
			mandeptIsNotNull: true,
			accbooks: [],
			currentPkaccbook: '',
			financeShowFlag: false, //财务区展开标志
			usufructasset_flag: false, //使用权资产标志
			//usedeptScales: [] //多使用部门的数据
			isaccruedbymonth: true //按月计提标识
		});
        
		this.clearBodies();

		// 关闭使用权页签
		disableUsufructAssetTab.call(this);
        // 恢复使用权页签控制
		reset.call(this);
	}

	//清空表体
	clearBodies() {
		let { props: { cardTable, getUrlParam } } = this;
		this.bodyTabDataManager = new BodyTabDataManager(this); //表体页签数据管理
		const status = getUrlParam('status');
		let tabs = CARD_ALL_TABS;
		if (status !== UISTATE.BROWSE) {
			tabs = [ steprentstandard_tab, rentpayplan_tab, depaccrual_tab_month, subequip_tab, usedept_tab ];
		}

		let mulTableData = {};
		tabs.forEach((tab) => {
			mulTableData[tab] = { rows: [] };
		});
		cardTable.setMulTablesData(mulTableData);
		//收起表体
		cardTable.toggleCardTable(tabs, false);
		//清空折旧记录 ECharts 数据
		this.setState(
			{
				depEchartsData: {},
				depEchartsHide: true,
				dep_tab_style: 'table'
			},
			() => {
				//折旧记录页签：如果之前展示的是 Echarts图，切换到 cardTable 需要特殊处理（上面清空方法不起作用-因为当时折旧的表格并不在界面上）
				cardTable.setMulTablesData({ [dep_tab]: { rows: [] } });
				//收起表体
				cardTable.toggleCardTable(dep_tab, false);
			}
		);
	}

	//财务组织字段初始化
	financeOrgInit() {
		let { props: { form } } = this;
		//获取个性化中心的设置
		let pk_org = getContext('pk_org', assetDataSource);
		let org_Name = getContext('org_Name', assetDataSource);
		if (pk_org) {
			form.setFormItemsValue(basicInfoForm, {
				pk_org: {
					value: pk_org,
					display: org_Name
				}
			});
			afterEvent.call(this, this.props, basicInfoForm, 'pk_org', { display: org_Name, value: pk_org });
		} else {
			this.props.initMetaByPkorg('pk_org');
		}
	}

	//通过卡片主键（pk_card）查询数据, 第二个参数用于联查的扩展（TODO主要是需要后台扩展，目前只实现了 pk_cardhistory）
	getData = (pk_card, { pk_cardhistory = '', pk_accbook = '', accyear = '', period = '' } = {}) => {
		const that = this;
		let url = URL.QUERY_CARD;
		let param = {
			pk: pk_card,
			pagecode: this.state.pageCode,
			queryCondition: {
				templateid: this.templateid
			}
		};
		if (pk_cardhistory || (pk_accbook && accyear && period)) {
			//来源于联查
			url = URL.QUERY_CARD_LINKED;
			param = {
				linkQueryAssetData: {
					pk_cardhistory,
					pk_accbook,
					accyear,
					accmonth: period
				},
				templetid: this.templateid,
				pagecode: this.state.pageCode,
				linktype: '', //来源的类型：用来区别来自于哪个地方的联查
				pk_card //卡片主键
			};
		}

		const promise = new Promise(function(resolve, reject) {
			ajax({
				url,
				data: param,
				success: (res) => {
					let { success, data } = res;
					if (success && data) {
						resolve(data);
					} else {
						/*国际化处理：指定的卡片不存在*/
						showMessage(that.props, { content: getMultiLangByID('201201504A-000025'), color: 'warning' });
						//从缓存中删除
						let obj = {
							pk_card
						};
						reject(obj);
					}
				},
				error: (err) => {
					showMessage(that.props, { content: err.message, color: 'danger' });
					let obj = {
						pk_card
					};
					reject(obj);
				}
			});
		});
		return promise;
	};

    /**
     * 设置数据
     * 更新缓存
     * @param {*} data 
     */
	getDataBack = (data) => {
		this.setValue(data);
		//更新缓存
		//这里判断是否来至于联查场景，联查需要更新列表缓存
		let opr = 'update';
		let scene = this.props.getUrlParam(linkQueryConst.SCENE);
		if (scene === linkQueryConst.SCENETYPE.linksce) {
			opr = 'add';
			//清除 url 中的联查标志，并设置 id = pk_cardhistory
			let pk_cardhistorys = this.getBodyAttributeValue(data, 'pk_cardhistory');
			if (pk_cardhistorys && pk_cardhistorys.length) {
				// 清空联查标志
				this.props.setUrlParam({
					id: pk_cardhistorys[0],
					[linkQueryConst.SCENE]: ''
				});
			} else {
				//console.log('------ 这里发生了数据错误 ERR_DATA_001 ------');
			}
		}
		this.updateAssetCache(data, opr);
	};

	//给界面设值
	setValue = async (data) => {
		let { props: { form, cardTable } } = this;

		this.updateBillSource4A3A(data);
		// 设置主键
		this.curr_pk_card = this.getHeadAttributeValue(data, 'pk_card');

		if (data.heads) {
			let assetAllData = [];
			data.heads.forEach((head) => {
				if (head.assetAll && head.assetAll.rows && head.assetAll.rows.length > 0) {
					assetAllData = assetAllData.concat(head.assetAll.rows);
				}
			});

			if (assetAllData.length) {
                this.setState({financeShowFlag: true});
				this.parseAssetData({ rows: assetAllData });
				assetAllData.forEach(async (row) => {
					let { values: { usufructasset_flag: { value: usufructasset_flag } } } = row;
					// 在表头处理使用权页签的标志位
					this.setState({ usufructasset_flag: usufructasset_flag });
					await handleMeta.call(this, usufructasset_flag);
				});
			}
		}

		if (data.bodysMap) {
			let tabs = Object.keys(data.bodysMap);
			//控制先解析 usufructassetForm， 因为其他页签的暂时依赖于使用权资产表头信息
			let indexOfUsufruct = tabs.indexOf(usufructassetForm);
			if (indexOfUsufruct != -1) {
				tabs.splice(indexOfUsufruct, 1);
				tabs.unshift(usufructassetForm);
			}

			for (let tab of tabs) {
				let { bodysMap: { [tab]: { [tab]: tabData } } } = data;
				if (usufructassetForm == tab) {
					if (tabData) {
						tabData.rows.forEach((row) => {
							// 由于 fa_card.ts 与 usu**.ts 可能不同（这个应该是不正确的），导致后台在验证ts时出现数据已经被他人修改的情况，所以这里使用 facard.ts 的数据
							delete row.values.ts;
							// 删除与 asset 页签重复的字段 【pk_group, pk_org, pk_org_v】
							[ 'pk_group', 'pk_org', 'pk_org_v' ].forEach((field) => {
								delete row.values[field];
							});
						});
						// 处理计息方式tab
						let {
							rows: [
								{
									values: {
										interest_base: { value: interest_base_value },
										step_rent: { value: step_rent }
									}
								}
							]
						} = tabData;

						if (step_rent && this.curr_pk_card) {
							/* 已经绑定了onHeadAngleToggle回调查询，但是它在2012版本注释了回调。坑爹的平台 */
							cardTable.toggleCardTable(steprentstandard_tab, step_rent);
							// 如果不包含数据再执行查阶梯租金
							if (!tabs.includes(steprentstandard_tab)) {
								tabShowButtonClick.call(this, this.props, steprentstandard_tab, step_rent);
							}
						}

						// 计息方式 1-按月
						this.state.isaccruedbymonth = interest_base_value == 1;

						// 启用对应的日月利息页签
						if (this.state.isaccruedbymonth) {
							enableMonthlyInterest.call(this);
						} else {
							enableDailyInterest.call(this);
						}

						enableUsufructAssetTab.call(this);
						form.setAllFormValue({ [basicInfoForm]: tabData });
					} else {
						disableUsufructAssetTab.call(this);
					}
				} else if (depaccrual_tab_month == tab) {
					//按月和按日的数据统一都放到了一起处理，所以在页面赋值时需要根据标识进行拆分
					if (tabData && tabData.rows) {
						// 1.启用对应的页签
						if (this.state.isaccruedbymonth) {
							enableMonthlyInterest.call(this);
						} else {
							enableDailyInterest.call(this);
						}

						// 2.设置页签数据
						this.setDepaccrualTab(tabData);

						// 3.设置缓存
						this.bodyTabDataManager.setTabVOs(
							this.curr_pk_card,
							this.state.currentPkaccbook,
							tab,
							JSON.parse(JSON.stringify(tabData))
						);
					}
				} else if (lease_change_tab == tab) {
					continue;
				} else {
					if (tabData) {
						cardTable.setTableData(tab, tabData);
						this.bodyTabDataManager.setTabVOs(
							this.curr_pk_card,
							this.state.currentPkaccbook,
							tab,
							JSON.parse(JSON.stringify(tabData))
						);
					}
				}
			}
		}

		this.setAssetSimpInfo();
		setStatus.call(this, this.props);
		// 处理变更记录列显示，隐藏变更期间
		cardTable.hideColByKey(logchangerecord_tab, [ 'change_period' ]);
	};

	/**
	 * 当编辑态时，是否允许编辑表头业务字段
	 */
	isAllowChangeHeadWhenEdit() {
		const { props: { getUrlParam } } = this;
		const status = getUrlParam('status');
		if (UISTATE.ADD == status) {
			// 新增状态（没有卡片主键），不需要控制
			return true;
		}

		if (UISTATE.EDIT == status) {
			if (this.editAbleBook && this.editAbleBook.length) {
				// 修改卡片前的所有账簿信息
				let oldAccbooks = Object.keys(this.assetDataMapBack);
				// 存在不可修改账簿
				let hasOneNonEditAccbook = oldAccbooks.some((book) => !this.editAbleBook.includes(book));
				return !hasOneNonEditAccbook;
			} else {
				// 不存在可修改账簿
				return false;
			}
		}

		return true;
	}

	convertNatureMonthDisplay(naturemonth) {
		//计算 naturemonth_display
		if (naturemonth) {
			try {
				naturemonth = parseInt(naturemonth);
				let year = parseInt(naturemonth / 12);
				let month = parseInt(naturemonth % 12);
				let naturemonth_display = `${year} 年 ${month} 月`;
				return {
					value: naturemonth + '',
					display: naturemonth_display
				};
			} catch (e) {
				/*国际化处理：【使用月限】转换错误*/
				showMessage(this.props, { content: getMultiLangByID('201201504A-000008'), color: 'danger' });
			}
		}
	}

	/**
	 * 更新缓存数据
	 * @param data 数据格式为 getData 返回的数据格式(del 除外)
	 * @param opr  有三种状态： add\update\del
	 * @param isUpdateListCache  是否更新列表态数据
	 * */
	updateAssetCache = (data, opr, isUpdateListCache = true) => {
		let { props: { cardPagination } } = this;
		if (opr === 'add') {
			const pk_card = this.getHeadAttributeValue(data, 'pk_card');
			//缓存卡片数据（自己缓存的）
			cardCache.setDefData(pk_card, assetDataSource, data);

			//是否更新列表缓存
			if (isUpdateListCache) {
				//更新 pk_cardhistory -> clientKeys 的缓存
				let pk2ClientKeyMap = cardCache.getDefData(constants.pk2ClientKeyMap, assetDataSource);

				let cardPaginationId = '';
				data.heads.map((head, index) => {
					let { assetAll: { rows: [ row ] } } = head;
					//每个账簿调用一次缓存
					const { values: { pk_cardhistory: { value: pk_cardhistory_val } } } = row;
					const { values: { pk_card: { value: pk_card_val } } } = row;
					const { values: { pk_accbook: { value: pk_accbook_val } } } = row;
					if (index === 0) {
						cardPaginationId = pk_cardhistory_val;
					}
					//更新平台缓存（列表态的缓存）
					cardCache.addCache(pk_cardhistory_val, null, null, assetDataSource, row.values);
					pk2ClientKeyMap[pk_cardhistory_val] = `${pk_card_val}_${pk_accbook_val}`;
				});

				// 设置翻页控件当前id
				cardPagination.setCardPaginationId({ id: cardPaginationId });
				cardCache.setDefData(constants.pk2ClientKeyMap, assetDataSource, pk2ClientKeyMap);
			}
		} else if (opr === 'update') {
			const pk_card_update = this.getHeadAttributeValue(data, 'pk_card');
			//缓存卡片数据（自己缓存的）
			cardCache.setDefData(pk_card_update, assetDataSource, data);

			//更新 pk_cardhistory -> clientKeys 的缓存  (来源于类别的改变会更改 pk_cardhistory 的值，所有这里统一更新一下即使没有发生变化)
			let pk2ClientKeyMap = cardCache.getDefData(constants.pk2ClientKeyMap, assetDataSource);

			if (isUpdateListCache) {
				data.heads.map((head) => {
					let { assetAll: { rows: [ row ] } } = head;
					//每个账簿调用一次缓存
					const { values: { pk_cardhistory: { value: pkvalue } } } = row;
					const { values: { pk_card: { value: pk_card_value } } } = row;
					const { values: { pk_accbook: { value: pk_accbook_value } } } = row;
					//更新平台缓存（列表态的缓存）
					cardCache.updateCache('pk_cardhistory', pkvalue, null, null, assetDataSource, row.values);
					pk2ClientKeyMap[pkvalue] = `${pk_card_value}_${pk_accbook_value}`;
				});
				cardCache.setDefData(constants.pk2ClientKeyMap, assetDataSource, pk2ClientKeyMap);
			}
		} else if (opr === 'del') {
			const { pk_card, pk_cardhistorys } = data;
			//缓存卡片数据（自己缓存的）
			cardCache.setDefData(pk_card, assetDataSource, undefined);

			if (isUpdateListCache) {
				pk_cardhistorys.map((pk_cardhistory) => {
					cardCache.deleteCacheById('pk_cardhistory', pk_cardhistory, assetDataSource);
				});
			}
		}
	};

	// 接收 socket 消息时更新缓存
	updateAssetCacheOnSocketMsg = (socketMsg) => {
		if (socketMsg.type === 'saga_error' && socketMsg.refreshData && socketMsg.refreshData.length) {
			let { refreshData: [ refreshData ] } = socketMsg;
			let assetvos = Object.values(this.assetDataMap);
			for (let assetvo of assetvos) {
				let { saga_status, saga_gtxid } = refreshData;
				assetvo.values.saga_status.value = saga_status;
				assetvo.values.saga_gtxid.value = saga_gtxid;
				//每个账簿调用一次缓存
				const { values: { pk_cardhistory: { value: pkvalue } } } = assetvo;
				//更新平台缓存（列表态的缓存）
				cardCache.updateCache('pk_cardhistory', pkvalue, null, null, assetDataSource, assetvo.values);
			}
		}
	};

	//从后台返回的数据中获取表头字段的属性值: 只适合获取业务字段
	getHeadAttributeValue = (data, field) => {
		if (data.heads && data.heads.length) {
			let assetAll = data.heads[0] && data.heads[0].assetAll && data.heads[0].assetAll.rows[0];
			return assetAll.values[field].value;
		}
	};

	//从后台返回的数据中获取表体字段的属性值: 取历史表中的字段数据
	getBodyAttributeValue = (data, field) => {
		let values = [];
		if (data.heads && data.heads.length) {
			data.heads.map((head) => {
				let { assetAll: { rows: [ row ] } } = head;
				//每个账簿调用一次缓存
				const { values: { [field]: { value: pkvalue } } } = row;
				values.push(pkvalue);
			});
		}
		return values;
	};

	// 解析表头数据
	parseAssetData = (assetAllData) => {
		let { props: { form } } = this;
		let { rows } = assetAllData;
		let assetDataMap = {};
		let accbooks = [];
		let business_accbook = '';
		for (let row of rows) {
			const { values: { pk_accbook: { value: pk_accbook, display: accbookName } } } = row;
			//表头使用部门字段处理:如果是多使用部门，则清空使用部门的字段
			const { values: { usedep_flag: { value: usedep_flag } } } = row;
			if (usedep_flag) {
				row['values']['pk_usedept'] = { display: null, value: null };
			}

			//使用月限
			const { values: { naturemonth: { value: naturemonth } } } = row;
			let naturemonthDisplay = this.convertNatureMonthDisplay(naturemonth);
			if (naturemonthDisplay) {
				row['values']['naturemonth_display'] = naturemonthDisplay;
			}
			if (pk_accbook) {
				accbooks.push({ pk_accbook, accbookName });
				assetDataMap[pk_accbook] = row;
				const { values: { business_flag: { value: business_flag_value } } } = row;
				if (business_flag_value) {
					//设置主账簿
					business_accbook = pk_accbook;
				}
			}
		}
		//如果不存在账簿，直接返回
		if (!accbooks.length) {
			form.setAllFormValue({
				[basicInfoForm]: assetAllData
			});
			return;
		} else {
			this.business_accbook = business_accbook;
			//给账簿排序，主账簿放在前面
			let accbooksNew = [];
			accbooksNew = accbooks.filter((accbookObj) => {
				return accbookObj['pk_accbook'] === business_accbook;
			});
			accbooksNew = accbooksNew.concat(
				accbooks.filter((accbookObj) => {
					return accbookObj['pk_accbook'] !== business_accbook;
				})
			);
			accbooks = accbooksNew;
		}

		

		// 如果备份数据不存在才可以备份数据
		// 备份数据
		if (Object.keys(this.assetDataMapBack).length == 0) {
			this.assetDataMapBack = JSON.parse(JSON.stringify(assetDataMap));
		}

		// 如果已经有选中的账簿，则选择该账簿（这里考虑卡片修改时导致账簿切换，之前选中的账簿要包含在新的账簿列表中）
		let pkaccbook = this.state.currentPkaccbook;
		if (pkaccbook) {
			let isContained = accbooks.some((accbookObj) => pkaccbook === accbookObj.pk_accbook);
			if (!isContained) {
				let [ { pk_accbook } ] = accbooks;
				pkaccbook = pk_accbook;
			}
		} else {
			let [ { pk_accbook } ] = accbooks;
			pkaccbook = pk_accbook;
		}
        this.state.currentPkaccbook = pkaccbook;

		this.setState({
			accbooks
		});

        // 缓存所有带账簿表头
        this.assetDataMap = assetDataMap;
        // 缓存当前账簿表头
        this.basicInfoData = this.assetDataMap[pkaccbook];
		const accbookData4Form = this.wrapAccbookData(pkaccbook);
		const basicInfoData4Form = this.wrapBasicInfoData();
		
		if (this.state.financeShowFlag) {
			form.setAllFormValue({
				[basicInfoForm]: basicInfoData4Form,
				[financeForm]: accbookData4Form
			});
		} else {
			form.setAllFormValue({
				[basicInfoForm]: basicInfoData4Form
			});
		}

		// 精度设置
		this.updateScale();
	};

	//设置卡片浏览态时：卡片头部的简要信息
	setAssetSimpInfo = () => {
		let { props: { form, cardTable } } = this;
		//获取当前多语
		let langIndex = getContext(loginContextKeys.languageIndex, assetDataSource);

		//设置基本信息区域上面的大标题
		let assetName = form.getFormItemsValue(basicInfoForm, 'asset_name');
		assetName = assetName['asset_name' + (langIndex || '')]; //取当前语种的字段(防止langIndex为空报错)
		assetName = assetName.display || assetName.value;

		// 4A3A-资产租入生成
		let bill_source = form.getFormItemsValue(basicInfoForm, 'bill_source');
		bill_source = bill_source.value;

		let assetCode = form.getFormItemsValue(basicInfoForm, 'asset_code');
		assetCode = assetCode.display || assetCode.value;

		let assetuser = form.getFormItemsValue(basicInfoForm, 'pk_assetuser');
		assetuser = assetuser.display || assetuser.value;

		let usedept = form.getFormItemsValue(basicInfoForm, 'pk_usedept');
		usedept = usedept.display || usedept.value;

		//从表体取数
		if (!usedept) {
			let usedeptNames = cardTable.getColValue(usedept_tab, 'pk_dept.name');
			let usedeptScales = cardTable.getColValue(usedept_tab, 'usescale');
			let temps = [];
			usedeptNames.map((name, i) => {
				const scaleNum = usedeptScales[i].value;
				if (scaleNum) {
					temps.push(name.value + ':' + formatNumber(scaleNum).props.children + '%');
				}
			});
			usedept = temps.join(', ');
		}

		this.setState({
			bill_source: bill_source, //资产来源 4A3A-租入合同
			asset_name: assetName, //资产名称
			asset_code: assetCode, //资产编码
			assetuser: assetuser, //使用人
			usedept: usedept //使用部门
		});
	};

	/**
	 * 更新合同租入标记
	 * @param {agg} data
	 */
	updateBillSource4A3A = (data) => {
		let { heads: [ { assetAll: { rows: [ { values: { bill_source: { value: bill_source } } } ] } } ] } = data;
		this.bill_source_4A3A = bill_source.startsWith(BILL_SOURCE_TYPES.lease_contract); //合同租入时的不可编辑控制标志
	};

	// 在有账簿的情况下
	// 从界面上取值，并更新到 state 中
	syncDataForCommit = () => {
		let { props: { form } } = this;
		const status = this.props.getUrlParam('status');

		//1. 获取基本信息字段
		let basicInfoFormValue = form.getAllFormValue(basicInfoForm);
		// 仅财务属性
		let financeFormFields = {};
		// 2. 获取财务字段
		if (this.state.financeShowFlag) {
			//财务区展开时才进行同步，否则财务区的值全部是null
			const financeFormValue = form.getAllFormValue(financeForm);
			//只过滤出财务区字段的数据
			this.financeFields.map((field) => {
				let { rows: [ { values } ] } = financeFormValue;
				financeFormFields[field] = values[field];
			});
		}

		// 组合基本信息和财务字段
		let { rows: [ { values: basicInfoFields0 } ] } = basicInfoFormValue;
		let basicAndFinanaceFields = { ...basicInfoFields0, ...financeFormFields };

		// 删除使用权页签字段
		const keys = Object.keys(basicAndFinanaceFields);
		for (let key of keys) {
			if (this.usufructasset_tab_fields.has(key)) {
				delete basicAndFinanaceFields[key];
			}
		}

		//把业务字段同步到所有账簿
		let busiFields = new Set(this.cardVoAttributes);
		FIELDS.BUSINESS_FIELD.map((f) => {
			busiFields.add(f);
		});

		let { assetDataMap } = this;
		for (let pk_accbook in assetDataMap) {
			let assetvo = assetDataMap[pk_accbook];
			for (let field of busiFields) {
				assetvo.values[field] = basicAndFinanaceFields[field];
			}
			if (status === UISTATE.ADD) {
				assetvo.status = VOSTATUS.NEW;
			} else if (status === UISTATE.EDIT) {
				assetvo.status = VOSTATUS.UPDATED;
			}
		}

		//把财务字段同步到当前账簿(前提是 financeShowFlag=true, 即财务区的form是显示的，不然取到的数据全部是null)
		if (this.state.currentPkaccbook && this.state.financeShowFlag) {
			let currAssetvo = assetDataMap[this.state.currentPkaccbook];
			for (let field of this.financeFields) {
				currAssetvo.values[field] = basicAndFinanaceFields[field];
			}
		}
	};

	//对计提明细页签数据进行赋值
	setDepaccrualTab = (data) => {
		let { props: { cardTable } } = this;

		if (this.state.isaccruedbymonth) {
			// 给日利息赋值
			let month_data = data.rows.filter((data) => {
				return data.values.isaccruedbymonth.value == true;
			});
			cardTable.setTableData(depaccrual_tab_month, { rows: month_data });
		} else {
			// 给月利息赋值
			let day_data = data.rows.filter((data) => {
				return data.values.isaccruedbymonth.value == false;
			});
			cardTable.setTableData(depaccrual_tab_month, { rows: day_data });
		}
	};

	/**
	 * 获取日利息、月利息的缓存数据
	 */
	getDepaccrualCache() {
		const { bodyTabDataManager } = this;
		return bodyTabDataManager.getTabCache(this.curr_pk_card, null, depaccrual_tab_month);
	}

	// 根据 pk_accbook 获取账簿数据
	getAccbookDataByPkaccbook = (pk_accbook) => {
		return this.assetDataMap[pk_accbook];
	};
	// 根据 pk_accbook 获取 适用于 form 格式的数据 （给finance form 设置值只能通过该方法）
	wrapAccbookData = (pk_accbook = this.state.currentPkaccbook) => {
		const data = this.assetDataMap[pk_accbook];
		if (data) {
			return { rows: [ JSON.parse(JSON.stringify(data)) ] };
		}
        return null;
	};

	// 获取 basicInfo 适用于 form 格式的数据
	wrapBasicInfoData = () => {
        if (this.basicInfoData) {
            return { rows: [ this.basicInfoData ] };
        }
        return null;
	};

    /**
     * 表头编辑后同步变更到缓存
     * 由于财务区拥有整个assetvo，例如：折本汇率，表头修改后，账簿区的值仍然是修改前的
     */
    syncFinanceForm = (field, newValue) => {
        let { props: { form } } = this;
        form.setFormItemsValue(financeForm, { [field]: newValue });
    }

	//生成更新保存需要的辅助参数 必须在 syncDataForCommit 执行完之后调用，否则数据可能不准确
	getAssitParam = () => {
		let param = {};
		const { basicInfoData: { values: { pk_card: { value: pk_card } } } } = this;
		if (pk_card) {
			param[pk_card] = {};
			//是否修改了资产类别
			const pk_category_old =
				this.assetDataMapBack[this.state.currentPkaccbook] &&
				this.assetDataMapBack[this.state.currentPkaccbook].values['pk_category'].value;
			const { basicInfoData: { values: { pk_category: { value: pk_category_new } } } } = this;
			if (pk_category_old !== pk_category_new) {
				param[pk_card]['editCategoryWhenUpdate'] = true;
			} else {
				let pk_accbooks_old = new Set();
				Object.values(this.assetDataMapBack).forEach((assetvo) => {
					pk_accbooks_old.add(assetvo.values.pk_accbook.value);
				});
				param[pk_card]['editCategoryWhenUpdate'] =
					this.state.accbooks.length !== pk_accbooks_old.size ||
					this.state.accbooks.some((accbook) => !pk_accbooks_old.has(accbook.pk_accbook));
			}
			// param[pk_card]['editCategoryWhenUpdate'] =
			// 	pk_category_old !== pk_category_new || this.editCategoryWhenUpdate;
			this.editCategoryWhenUpdate = param[pk_card]['editCategoryWhenUpdate'];
		}
		return param;
	};

	//多使用部门页签肩部的按钮
	getUsedeptTableHead() {
		let status = this.props.getUrlParam('status');
		if (status === UISTATE.BROWSE) {
			return '';
		}
		let { createButtonApp } = this.props.button;

		return (
			<div className="shoulder-definition-area">
				<div className="definition-icons" />
				{createButtonApp({
					area: 'card_body1',
					buttonLimit: 10,
					onButtonClick: usedeptButtonClick.bind(this)
				})}
			</div>
		);
	}
	
	//利润中心部门页签肩部的按钮
	getLrzxTableHead() {
		let status = this.props.getUrlParam('status');
		if (status === UISTATE.BROWSE) {
			return '';
		}
		let { createButtonApp } = this.props.button;

		return (
			<div className="shoulder-definition-area">
				<div className="definition-icons" />
				{createButtonApp({
					area: 'card_body6',
					buttonLimit: 10,
					onButtonClick: lrzxButtonClick.bind(this)
				})}
			</div>
		);
	}

	//附属设备页签肩部的按钮
	getSubequipTableHead() {
		let status = this.props.getUrlParam('status');
		if (status === UISTATE.BROWSE) {
			return '';
		}
		let { createButtonApp } = this.props.button;
		return (
			<div className="shoulder-definition-area">
				<div className="definition-icons">
					{createButtonApp({
						area: 'card_body',
						buttonLimit: 10,
						onButtonClick: subequipButtonClick.bind(this)
					})}
				</div>
			</div>
		);
	}

	//计提记录页签肩部的按钮
	getDepTableHead = () => {
		let { createButtonApp } = this.props.button;

		return (
			<div className="shoulder-definition-area">
				<div className="definition-icons">
					{createButtonApp({
						area: 'card_body2',
						buttonLimit: 10,
						onButtonClick: () => {
							if(this.state.dep_tab_style === 'table'){
								this.setState({ dep_tab_style: 'echarts' });
								return;
							}
							if(this.state.dep_tab_style === 'echarts'){
								this.setState({ dep_tab_style: 'table' });
								return;
							}
						}
					})}
				</div>
			</div>
		);
	};

	//阶梯租金标准页签肩部的按钮
	getStepRentStandardTableHead() {
		let status = this.props.getUrlParam('status');
		if (status === UISTATE.BROWSE) {
			return '';
		}
		let { createButtonApp } = this.props.button;
		return (
			<div className="shoulder-definition-area">
				<div className="definition-icons">
					{createButtonApp({
						area: 'card_body2',
						buttonLimit: 10,
						onButtonClick: stepRentStandardButtonClick.bind(this)
					})}
				</div>
			</div>
		);
	}

	//计提利息明细页签肩部的按钮
	getDepaccrualTableHead() {
		let { createButtonApp } = this.props.button;
		return (
			<div className="shoulder-definition-area">
				<div className="definition-icons">
					{createButtonApp({
						area: 'card_body4',
						buttonLimit: 10,
						onButtonClick: depaccrualButtonClick.bind(this)
					})}
				</div>
			</div>
		);
	}

	//计提记录从echarts状态切换回table状态
	onReturnTable = () => {
		this.setState({ dep_tab_style: 'table' }, () => {
			tabShowButtonClick.call(this, this.props, dep_tab, true);
		});
	};

	//返回列表页
	backToList = () => {
		linkToList(this.props);
	};

	//从 url 地址栏中获取 pk_card
	getPkcardFromUrl = () => {
		let pk_card = this.props.getUrlParam('id');
		let scene = this.props.getUrlParam(linkQueryConst.SCENE);
		if (scene !== linkQueryConst.SCENETYPE.linksce) {
			//取出真正的 卡片主键
			let pk2ClientKeyMap = cardCache.getDefData(constants.pk2ClientKeyMap, assetDataSource);
			let clientKey = pk2ClientKeyMap ? pk2ClientKeyMap[pk_card] : '';
			pk_card = this.getPkcardFromClientKey(clientKey);
		}
		return pk_card;
	};

	//根据 URL 中 pk_cardhistory 获取当前需要显示的账簿
	getPkaccbookByPkcardHis = () => {
		let pk_accbook = '';
		let scene = this.props.getUrlParam(linkQueryConst.SCENE);
		if (scene !== linkQueryConst.SCENETYPE.linksce) {
			let pk = this.props.getUrlParam('id');
			//取出真正的 卡片主键
			let pk2ClientKeyMap = cardCache.getDefData(constants.pk2ClientKeyMap, assetDataSource);
			let clientKey = pk2ClientKeyMap ? pk2ClientKeyMap[pk] : '';
			if (clientKey && clientKey.indexOf('_') > -1) {
				pk_accbook = clientKey.split('_')[1];
			}
		}
		return pk_accbook;
	};

	getPkcardFromClientKey = (clientKey) => {
		let pk_card = '';
		if (clientKey && clientKey.indexOf('_') > -1) {
			pk_card = clientKey.split('_')[0];
		}
		return pk_card;
	};

	//楼梯导航点击
	stairNavClick = (moudleId) => {
		const { props: { cardTable } } = this;
		if (![ basicInfoForm, financeForm ].includes(moudleId)) {
			cardTable.setTableData(moudleId, { rows: [] });
			cardTable.toggleCardTable(moudleId, true);
			tabShowButtonClick.call(this, this.props, moudleId, true);
		} else if (financeForm === moudleId) {
			if (this.state.financeShowFlag) {
				return;
			}
			//展开财务区域
			toggleFinanceArea.call(this);
		}
	};

	updateParent = (value, choose) => {
		this.leaseChangeNewData[choose].value = value;
	};

	// 更新表体金额的精度，使用原币原值的精度
	updateScale() {
		let { props: { form } } = this;
		this.originvalue_digit = form.getFormItemsValue(basicInfoForm, 'originvalue').scale;
	}

	render() {
		let { cardTable, form, button, modal, ncmodal, pageConfig } = this.props;
		let { createForm } = form;
		let { createCardTable } = cardTable;
		let { createErrorFlag, createButtonApp } = button;
		let { createModal } = modal;

		//获取模板中财务区的名称
		const meta = this.props.meta.getMeta();
		console.log('主页渲染*** ', meta['usufructasset_tab']);
		const financeAreaName = meta[financeForm] && meta[financeForm]['name'];

		// 计提利息记录页签和变更记录页签，请放在附属设备页签上面
		const tabsBehaviorAlikeBeforeSubequip_tab = [
			/* 国际化处理： 计提利息记录 */
			logdepaccrual_tab,
			/* 国际化处理： 变更记录 */
			logchangerecord_tab
		];
		// 行为相似的tab页 统一进行处理
		const tabsBehaviorAlike = [
			/* 国际化处理： 折旧记录 */

			dep_tab,
			/* 国际化处理： 变动记录 */
			alter_tab,
			/* 国际化处理： 评估记录 */
			evaluate_tab,
			/* 国际化处理： 减少记录 */
			reduce_tab,
			/* 国际化处理： 减值记录 */
			devalue_tab,
			/* 国际化处理： 调拨记录 */
			deploy_tab
		];

		let status = this.props.getUrlParam('status');

		let navigatorOnBrowse = [
			{ id: dep_tab, name: getMultiLangByID('201201504A-000041') /* 国际化处理： 折旧记录 */ },
			{ id: alter_tab, name: getMultiLangByID('201201504A-000042') /* 国际化处理： 变动记录 */ },
			{ id: evaluate_tab, name: getMultiLangByID('201201504A-000043') /* 国际化处理： 评估记录 */ },
			{ id: reduce_tab, name: getMultiLangByID('201201504A-000044') /* 国际化处理： 减少记录 */ },
			{ id: devalue_tab, name: getMultiLangByID('201201504A-000045') /* 国际化处理： 减值记录 */ },
			{ id: deploy_tab, name: getMultiLangByID('201201504A-000046') /* 国际化处理： 调拨记录 */ }
		];

		let tableHeadMap = new Map();
		tableHeadMap.set(dep_tab, this.getDepTableHead);
        let depEchartsData = this.state.depEchartsData;
		return (
			<div className={`nc-bill-extCard nc-theme-area-bgc ${getThemeUtils() + 'theme'}`} id="fa-newasset-facard-card">
				{/* ******************************楼梯开始****************************** */}
				<NCAnchor>
					{/* 基本信息锚点 */}
					{meta[basicInfoForm] && meta[basicInfoForm].areaVisible ? (
						<NCScrollLink
							to={basicInfoForm}
							spy={true}
							smooth={true}
							duration={300}
							offset={-100}
							clickFun={this.stairNavClick.bind(this, basicInfoForm)}
						>
							<p>{getMultiLangByID('201201504A-000038') /* 国际化处理： 基本信息*/}</p>
						</NCScrollLink>
					) : null}
					{/* 使用权页签锚点 */}
					{meta[usufructassetForm] /* && meta[usufructassetForm].areaVisible */ &&
					this.state.usufructasset_flag ? (
						<NCScrollLink
							to={usufructassetForm}
							spy={true}
							smooth={true}
							duration={300}
							offset={-100}
							clickFun={this.stairNavClick.bind(this, usufructassetForm)}
						>
							<p>{getMultiLangByID('201201504A-000055') /* 国际化处理： 使用权资产 */}</p>
						</NCScrollLink>
					) : null}
					{/* 财务核算账簿锚点 */}
					{meta[financeForm] && meta[financeForm].areaVisible ? (
						<NCScrollLink
							to={financeForm}
							spy={true}
							smooth={true}
							duration={300}
							offset={-100}
							clickFun={this.stairNavClick.bind(this, financeForm)}
						>
							<p>{getMultiLangByID('201201504A-000039') /* 国际化处理： 财务区 */}</p>
						</NCScrollLink>
					) : null}
					{/* 阶梯租金标准锚点 */}
					{meta[steprentstandard_tab] &&
					meta[steprentstandard_tab].areaVisible &&
					this.state.usufructasset_flag ? (
						<NCScrollLink
							to={steprentstandard_tab}
							spy={true}
							smooth={true}
							duration={300}
							offset={-100}
							clickFun={this.stairNavClick.bind(this, steprentstandard_tab)}
						>
							<p>{getMultiLangByID('201201504A-000058') /* 国际化处理： 阶梯租金标准 */}</p>
						</NCScrollLink>
					) : null}
					{/* 租金付款计划锚点 */}
					{meta[rentpayplan_tab] && meta[rentpayplan_tab].areaVisible && this.state.usufructasset_flag ? (
						<NCScrollLink
							to={rentpayplan_tab}
							spy={true}
							smooth={true}
							duration={300}
							offset={-100}
							clickFun={this.stairNavClick.bind(this, rentpayplan_tab)}
						>
							<p>{getMultiLangByID('201201504A-000056') /* 国际化处理： 租金付款计划 */}</p>
						</NCScrollLink>
					) : null}
					{/* 计提利息明细锚点 */}
					{meta[depaccrual_tab_month] &&
					meta[depaccrual_tab_month].areaVisible &&
					this.state.usufructasset_flag ? (
						<NCScrollLink
							to={depaccrual_tab_month}
							spy={true}
							smooth={true}
							duration={300}
							offset={-100}
							clickFun={this.stairNavClick.bind(this, depaccrual_tab_month)}
						>
							<p>
								{this.state.isaccruedbymonth ? (
									getMultiLangByID('201201504A-000057') /* 国际化处理： 计提利息明细(按月) */
								) : (
									getMultiLangByID('201201504A-000062')
								) /* 国际化处理： 计提利息明细(按天) */}
							</p>
						</NCScrollLink>
					) : null}
					{/* 计提利息记录锚点 */}
					{meta[logdepaccrual_tab] &&
					meta[logdepaccrual_tab].areaVisible &&
					status === UISTATE.BROWSE &&
					this.state.usufructasset_flag ? (
						<NCScrollLink
							to={logdepaccrual_tab}
							spy={true}
							smooth={true}
							duration={300}
							offset={-100}
							clickFun={this.stairNavClick.bind(this, logdepaccrual_tab)}
						>
							<p>{getMultiLangByID('201201504A-000059') /* 国际化处理： 计提利息记录 */}</p>
						</NCScrollLink>
					) : null}
					{/* 租赁变更记录锚点 */}
					{meta[logchangerecord_tab] &&
					meta[logchangerecord_tab].areaVisible &&
					status === UISTATE.BROWSE &&
					this.state.usufructasset_flag ? (
						<NCScrollLink
							to={logchangerecord_tab}
							spy={true}
							smooth={true}
							duration={300}
							offset={-100}
							clickFun={this.stairNavClick.bind(this, logchangerecord_tab)}
						>
							<p>{getMultiLangByID('201201504A-000060') /* 国际化处理： 租赁变更记录 */}</p>
						</NCScrollLink>
					) : null}

					{/* 附属设备锚点 */}
					{meta[subequip_tab] && meta[subequip_tab].areaVisible ? (
						<NCScrollLink
							to={subequip_tab}
							spy={true}
							smooth={true}
							duration={300}
							offset={-100}
							clickFun={this.stairNavClick.bind(this, subequip_tab)}
						>
							<p>{getMultiLangByID('201201504A-000040') /* 国际化处理： 附属设备 */}</p>
						</NCScrollLink>
					) : null}

					{/* 折旧记录、变动记录、评估记录、减少记录、减值记录、调拨记录锚点 */}
					{navigatorOnBrowse.map((nav) => {
						return status === UISTATE.BROWSE && meta[nav.id] && meta[nav.id].areaVisible ? (
							<NCScrollLink
								to={nav.id}
								spy={true}
								smooth={true}
								duration={300}
								offset={-100}
								clickFun={this.stairNavClick.bind(this, nav.id)}
							>
								<p>{nav.name}</p>
							</NCScrollLink>
						) : null;
					})}

					{/* 多使用部门锚点 */}
					{meta[usedept_tab] && meta[usedept_tab].areaVisible ? (
						<NCScrollLink
							to={usedept_tab}
							spy={true}
							smooth={true}
							duration={300}
							offset={-100}
							clickFun={this.stairNavClick.bind(this, usedept_tab)}
						>
							<p>{getMultiLangByID('201201504A-000047') /* 国际化处理： 多使用部门 */}</p>
						</NCScrollLink>
					) : null}
					
					{/* 利润中心部门 */}
					{meta[lrzx_tab] && meta[lrzx_tab].areaVisible ? (
						<NCScrollLink
							to={lrzx_tab}
							spy={true}
							smooth={true}
							duration={300}
							offset={-100}
							clickFun={this.stairNavClick.bind(this, lrzx_tab)}
						>
							<p>{getMultiLangByID('201201504A-000047') /* 国际化处理： 多使用部门 */}</p>
						</NCScrollLink>
					) : null}
				</NCAnchor>
				{/* ******************************楼梯结束****************************** */}
				<div className="nc-bill-top-area">
					<NCHotKeys
						keyMap={{
							unLockBtnHandler: 'alt + ctrl + r' //隐藏快捷键 , 用于解锁卡片
						}}
						handlers={{
							unLockBtnHandler: () => {
								//浏览态快捷键解锁卡片
								if (status === UISTATE.BROWSE) {
									// 解锁卡片
									lockcards.call(this, 'unlock');
									showMessage(this.props, { content: 'unLock success.', color: 'success' });
								}
							}
						}}
						// 是否启用组件
						enabled={true}
						// 是否为聚焦触发
						focused={true}
						// 默认display 可以设置 inline-block 等dispaly属性
						display="none"
					/>
					<NCAffix>
						<NCDiv areaCode={NCDiv.config.HEADER} className="nc-bill-header-area">
							{/* 标题区 返回按钮*/}
							<div className="header-title-search-area">
								{createCardTitleArea.call(this, this.props, {
									title: pageConfig.title,
									backBtnClick: this.backToList
								})}
							</div>
							{/* 按钮区 */}
							<div className="header-button-area">
								{/* 创建重试、回退等 saga 状态按钮 */}
								{createErrorFlag({
									headBtnAreaCode: BTN_AREA.CARD_HEAD
								})}
								{createButtonApp({
									area: BTN_AREA.CARD_HEAD,
									onButtonClick: buttonClick.bind(this)
								})}
								{[ UISTATE.BROWSE, UISTATE.BLANK ].includes(status) &&
									button.setButtonVisible(TABLE_HEAD.LEASE_CHANGE, this.state.usufructasset_flag)}
							</div>
							{/*浏览态增加 上一页/下一页 */}
							{createCardPaginationArea.call(this, this.props, {
								formId: basicInfoForm,
								dataSource: assetDataSource,
								pageInfoClick: pageInfoClick.bind(this)
							})}
						</NCDiv>
					</NCAffix>

					<div className="nc-bill-form-area">
						<NCScrollElement name={basicInfoForm}>
							{/*浏览态 卡片名称 资产编码 使用人 使用部门 放大显示*/}
							{status === UISTATE.BROWSE ? (
								<div className="card-title-area">
									<p>
										<span title={this.state.asset_name}>{this.state.asset_name}</span>
										<span>{this.state.asset_code}</span>
									</p>
									<p>
										<span title={this.state.assetuser}>{this.state.assetuser}</span>
										<span title={this.state.usedept}>{this.state.usedept}</span>
									</p>
								</div>
							) : (
								''
							)}

							{createForm(basicInfoForm, {
								onAfterEvent: afterEvent.bind(this),
								onBeforeEvent: headBeforeEvent.bind(this)
							})}
						</NCScrollElement>

						{/* 财务核算账簿 */}
						<NCScrollElement name={financeForm}>
							<div className="group-form-wrapper">
								{
									<NCDiv
										className="group-form-name finance-group-name"
										areaCode={NCDiv.config.Group}
										fieldid={financeForm}
									>
										<div onClick={toggleFinanceArea.bind(this)}>
											<span className="name">
												<span className="name-icon">{this.state.financeShowFlag ? '-' : '+'}</span>
												{financeAreaName || ''}
											</span>
											<span className="finance-line" />
										</div>
									</NCDiv>
								}
								{this.state.financeShowFlag && (
									<div className="accbook">
										{/* 账簿按钮*/}
										<div className="accbook-btn-area group-form-name">
											{this.state.accbooks.map((accbook) => (
												<span
													className={`name ${this.state.currentPkaccbook == accbook.pk_accbook
														? 'accbook-checked'
														: ''}`}
													onClick={accbookSwitchHandler.bind(this, accbook.pk_accbook)}
													key={accbook}
												>
													{accbook.accbookName}
												</span>
											))}
										</div>

										<div>
											{createForm(financeForm, {
												onAfterEvent: afterEvent.bind(this),
												onBeforeEvent: headBeforeEvent.bind(this)
											})}
										</div>
									</div>
								)}
							</div>
						</NCScrollElement>
					</div>
				</div>
				<div className="nc-bill-bottom-area">
                <div>
						{/* 阶梯租金标准 */}
						{this.state.usufructasset_flag && (
							<NCScrollElement name={steprentstandard_tab}>
								{createCardTable(steprentstandard_tab, {
									tableHead: this.getStepRentStandardTableHead.bind(this),
									onHeadAngleToggle: tabShowButtonClick.bind(this),
									selectedChange: rowSelected.bind(this),
									onAfterEvent: stepRentAfterEvent.bind(this),
									showCheck: true,
									showIndex: true
								})}
							</NCScrollElement>
						)}
						{/* 租金付款计划 */}
						{this.state.usufructasset_flag && (
							<NCScrollElement name={rentpayplan_tab}>
								{createCardTable(rentpayplan_tab, {
									onHeadAngleToggle: tabShowButtonClick.bind(this),
									selectedChange: rowSelected.bind(this),
									showCheck: true,
									showIndex: true
								})}
							</NCScrollElement>
						)}
						{/* 计提利息明细(按月) */}
						{this.state.usufructasset_flag && (
							<NCScrollElement name={depaccrual_tab_month}>
								{createCardTable(depaccrual_tab_month, {
									tableHead: this.getDepaccrualTableHead.bind(this),
									onHeadAngleToggle: tabShowButtonClick.bind(this),
									selectedChange: rowSelected.bind(this),
									showCheck: true,
									showIndex: true
								})}
							</NCScrollElement>
						)}

						{/* 计提利息记录页签和变更记录页签，请放在附属设备页签上面 */}
						<div
							className={
								status === UISTATE.BROWSE && this.state.usufructasset_flag ? (
									'cardTable-show'
								) : (
									'cardTable-hide'
								)
							}
						>
							{/*仅需要在浏览态显示的页签，且行为操作基本相同*/}
							{this.state.usufructasset_flag &&
								tabsBehaviorAlikeBeforeSubequip_tab.map((tab) => {
									return (
										<div key={tab}>
											<NCScrollElement name={tab}>
												{createCardTable(tab, {
													tableHead: tableHeadMap.get(tab),
													onHeadAngleToggle: tabShowButtonClick.bind(this),
													showCheck: true,
													showIndex: true
												})}
											</NCScrollElement>
										</div>
									);
								})}
						</div>

						{/* 附属设备 */}
						<NCScrollElement name={subequip_tab}>
							{createCardTable(subequip_tab, {
								tableHead: this.getSubequipTableHead.bind(this),
								onHeadAngleToggle: tabShowButtonClick.bind(this),
								selectedChange: rowSelected.bind(this),
								showCheck: true,
								showIndex: true
							})}
						</NCScrollElement>
					</div>

					<div className={`${status === UISTATE.BROWSE ? 'cardTable-show' : 'cardTable-hide'}`}>
						{/* <div className={ status === UISTATE.BROWSE ? 'cardTable-show' : 'cardTable-hide'}> */}
						{/*仅需要在浏览态显示的页签，且行为操作基本相同*/}
						{tabsBehaviorAlike.map((tab) => {
							if (tab === 'dep_tab') {
								return (
									<div className="dep_tab_area" key={tab}>
										<NCScrollElement name={tab}>
											{this.state.dep_tab_style === 'table' ? (
												createCardTable(tab, {
													tableHead: tableHeadMap.get(tab),
													onHeadAngleToggle: tabShowButtonClick.bind(this),
													showIndex: true,
													showMore: false
												})
											) : (
												<DepEcharts
													{...this.props}
													onReturnTable={this.onReturnTable}
													seriesData={depEchartsData}
													hide={this.state.depEchartsHide}
												/>
											)}
										</NCScrollElement>
									</div>
								);
							}
							return (
								<div key={tab}>
									<NCScrollElement name={tab}>
										{createCardTable(tab, {
											tableHead: tableHeadMap.get(tab),
											onHeadAngleToggle: tabShowButtonClick.bind(this),
											showCheck: true,
											showIndex: true
										})}
									</NCScrollElement>
								</div>
							);
						})}
					</div>

					<div>
						{/* 多使用部门 */}
						<NCScrollElement name={usedept_tab}>
							{createCardTable(usedept_tab, {
								tableHead: this.getUsedeptTableHead.bind(this),
								selectedChange: rowSelected.bind(this),
								onBeforeEvent: usedeptBeforeEvent.bind(this),
								onAfterEvent: usedeptAfterEvent.bind(this),
								showCheck: true,
								showIndex: true
							})}
						</NCScrollElement>
						
						{/* 利润中心部门 */}
						<NCScrollElement name={lrzx_tab}>
							{createCardTable(lrzx_tab, {
								tableHead: this.getLrzxTableHead.bind(this),
								selectedChange: rowSelected.bind(this),
								onBeforeEvent: lrzxBeforeEvent.bind(this),
								onAfterEvent: lrzxAfterEvent.bind(this),
								showCheck: true,
								showIndex: true
							})}
						</NCScrollElement>
					</div>
				</div>
				{createModal(MODAL_ID.CopyModal, {
					title: getMultiLangByID('201201504A-000026') /* 国际化处理： 卡片复制 */,
					content: this.facardCopy.copyCardDialog(this),
					userControl: true,
					className: 'combine'
				})}
				{/* 附件*/}
				{createNCUploader.call(this, 'uploader', {})}
				{/* 预警提示框 */}
				{createModal(MODAL_ID.ConfirmModal, { color: 'warning' })}
				{/* 计算租赁负债提示框 */}
				{createModal(MODAL_ID.LeaseLiabilitiesModal, {
					title: getMultiLangByID('201201504A-000088') /* 国际化处理： 提示信息*/,
					content: getMultiLangByID('201201504A-000087') /* 国际化处理： 计算后的原值与卡片上的原值不同，是否更新? */,
					size: 'sm',
					leftBtnName: '是', //左侧按钮名称
					rightBtnName: '否' //右侧按钮名称
				})}
				{createModal(MODAL_ID.LeaseChangeModal, {
					title: getMultiLangByID('201201504A-000063') /* 国际化处理： 租赁变更 */,
					content: (
						<LeaseChange
							{...this.props}
							lockcards={lockcards.bind(this)}
							transiTypeAry={this.state.transiTypeAry}
							leaseChangeNewData={this.leaseChangeNewData}
							bill_source_4A3A={this.bill_source_4A3A}
							originvalue_digit={this.originvalue_digit}
							updateParent={this.updateParent.bind(this)}
						/>
					),
					userControl: true,
					size: 'xlg'
				})}
				{/* 创建 socket 链接 */}
				{creatCardSocket.call(this, this.props, {
					headBtnAreaCode: BTN_AREA.CARD_HEAD, // 按钮区域编码,用于平台内部更新按钮状态
					formAreaCode: basicInfoForm, //表单区域编码, 用于平台内部更新表头数据
					onMessage: (props, msg) => {
						//监听消息
						// 仅处理自己的按钮显示控制，重试和回退按钮有平台处理
						this.updateAssetCacheOnSocketMsg(msg);

						if (msg.error) {
							// 补充事务存在异常时，页面要显示的按钮控制逻辑
							// 由需求定义保留显示按钮逻辑
							// 单据追溯和刷新比较重要，需要显示
						} else {
							// 事务通过重试或回退方式成功时，要恢复按钮显示控制逻辑
						}
					},
					//billtype: pageConfig.billType, //单据类型, 用于查询追溯
					billpkname: FIELDS.HEAD_PK //单据主键名, 用于查询追溯
				})}
			</div>
		);
	}
}

export default Card;
